<template>
  <view class="bd t1">
    <!-- 				<view>
					<u-calendar v-model="show" :mode="mode" :start-text="text2"></u-calendar>
				</view> -->
    <!-- 		<view class="inp-group flex flex-al-c">
			<view class="inp-title">身高(CM)</view>
			<u-input v-model="height" type="number" :border="true" placeholder="请输入身高" maxlength="5"/>
		</view> -->
    <view class="inp-group flex flex-al-c">
      <view class="inp-title t1">体重(KG)</view>
      <u-input
        v-model="weight"
        type="number"
        :border="true"
        @input="checkNum($event, 2)"
        placeholder="请输入体重"
      />
    </view>
    <view class="inp-group flex flex-al-c" v-show="firstcode != 0">
      <view class="inp-title t1">孕周</view>
      <u-input
        v-model="gestationalAge"
        :border="true"
        placeholder="请输入孕周"
        maxlength="2"
        type="number"
        <!-- οnkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,1})?).*$/g, '$1')" -->
      />
    </view>
    <view class="inp-group flex flex-al-c" v-show="firstcode == 0">
      <view class="inp-title">身高(CM)</view>
      <u-input
        v-model="height"
        :border="true"
        placeholder="请输入身高"
        @input="checkNum($event, 1)"
        type="number"
      />
    </view>
    <!-- <view class="inp-group flex flex-al-c">
			<view class="inp-title">采集日期</view>
			<u-input v-model="collectTime" type="text" :border="true" @tap="checkTime" disabled/>
			<u-picker mode="time" v-model="show" :params="params" @confirm="getTime"></u-picker>
		</view> -->

    <view style="width: 90%; margin: 100upx auto 0">
      <button
        type="default"
        style="background: #18c7e1; color: #fff"
        @tap="sub"
      >保存</button>
    </view>
  </view>
</template>
<script>
export default {
  data() {
    return {
      height: "",
      weight: "",
      gestationalAge: "",
      gestationalheight: "",
      id: "",
      collectTime: this.config.pub.getDate(),
      params: {
        year: true,
        month: true,
        day: true,
      },
    };
  },
  onLoad(options) {
    //console.log(options)
    this.firstcode = options.first;
    this.height = options.height || "";
    this.weight = options.weight || "";
    this.id = options.id || "";
    this.gestationalAge = options.gestationalAge || "";
  },
  onReady() {
    // this.getUiStyle();
  },
  methods: {
    getUiStyle() {
      var style = plus.navigator.getUiStyle();
      if ("dark" == style) {
        console.log("当前为暗黑模式");
        uni.setTabBarStyle({
          backgroundColor: "#1B1C1E",
        });
        uni.setNavigationBarColor({
          frontColor: "#ffffff",
          backgroundColor: "#1B1C1E",
          animation: {
            duration: 400,
            timingFunc: "easeIn",
          },
        });
      } else {
        console.log("当前为普通模式");
      }
    },
    checkNum(e, type) {
      let val = e.replace(/(^\s*)|(\s*$)/g, "");
      if (!val) {
        if (type == 1) {
          this.height = "";
        } else if (type == 2) {
          this.weight = "";
        }
        return;
      }
      var reg = /[^\d.]/g;
      // 只能是数字和小数点，不能是其他输入
      val = val.replace(reg, "");
      // // 保证第一位只能是数字，不能是点
      val = val.replace(/^\./g, "");
      // // 小数只能出现1位
      val = val.replace(".", "$#$").replace(/\./g, "").replace("$#$", ".");
      // // 小数点后面保留2位
      val = val.replace(/^(\-)*(\d+)\.(\d\d).*$/, "$1$2.$3");
      this.$nextTick(() => {
        if (type == 1) {
          this.height = val;
        } else if (type == 2) {
          this.weight = val;
        }
      });
    },
    dateChange1(e) {
      this.collectTime = e.target.value;
    },
    checkTime() {
      this.show = true;
    },
    getTime(time) {
      this.collectTime = time.year + "-" + time.month + "-" + time.day;
    },
    valid() {
      const reg = /(^[1-9](\d+)?(\.\d{1,2})?$)|(^0$)|(^\d\.\d{1,2}$)/;
      if (this.firstcode == 0) {
        if (!this.height) {
          uni.showToast({
            title: "请输入身高信息",
            icon: "none",
          });
          return false;
        }
        if (!reg.test(this.height)) {
          uni.showToast({
            title: "请输入正确的身高，如有小数请保留至后两位小数",
            icon: "none",
          });
          return;
        }
        if (this.height < 10 || this.height > 200) {
          uni.showToast({
            title: "身高的范围在10-200之间",
            icon: "none",
          });
          return;
        }
      }
      if (!this.weight) {
        uni.showToast({
          title: "请输入体重信息",
          icon: "none",
        });
        return false;
      }
      if (!reg.test(this.weight)) {
        uni.showToast({
          title: "请输入正确的体重，如有小数请保留至后两位小数",
          icon: "none",
        });
        return;
      }
      if (this.weight < 0 || this.weight > 200) {
        uni.showToast({
          title: "体重的范围在0-200之间",
          icon: "none",
        });
        return;
      }
      if (!this.weight) return false;
      return true;
    },
    // 保存
    sub() {
      if (!this.valid()) return;
      if (this.gestationalAge < 1 && this.firstcode != 0) {
        uni.showToast({
          title: "请输入正确的孕周",
          icon: "none",
        });
        return;
      }
      let self = this;
      uni.showLoading({
        title: "加载中",
        mask: true,
      });
      setTimeout((s) => {
        uni.hideLoading();
      }, 5000);
      this.config
        .post("/gravid/planGravidPrenatalCheck/gravidRecord", {
          height: this.height,
          weight: this.weight,
          gestationalAge: this.gestationalAge,
          id: this.id,
          // createTime: this.collectTime,
        })
        .then((res) => {
          uni.hideLoading();
          if (res.data.code === 200) {
            uni.showToast({
              title: res.data.msg,
              icon: "none",
            });
            setTimeout((s) => {
              uni.navigateBack();
            }, 500);
          } else {
            if (res.data.code == "-201") {
              self.config.handleError(res.data);
            } else {
              uni.showToast({
                title: self.config.handleError(res.data),
                icon: "none",
              });
            }
          }
        });
    },
    change(status) {
      if (status == true) {
        this.buttonStatus = true;
        this.buttonText = "已完成";
      } else {
        this.buttonStatus = false;
        this.buttonText = "未完成";
      }
    },
  },
};
</script>

<style lang="less" scoped>
page {
  background-color: #fcffff;
  margin-top: -30rpx;
  position: fixed;
}
.inp-group {
  padding: 0 20upx;
  margin: 30upx 0;

  .inp-title {
    width: 200upx;
  }
}
</style>
<style scoped>
@media (prefers-color-scheme: closedark) {
  page {
    background-color: #1b1c1e !important;
    padding-top: 100rpx;
  }

  .bd {
    width: 100%;
    background-color: #1b1c1e !important;
    height: calc(100vh - var(--window-top));
    padding-top: 50rpx;
    position: fixed;
    overflow: hidden;
  }

  .bd1 {
    background-color: #38383c !important;
  }

  .t1 {
    color: #ccc !important;
  }
  >>> input {
    color: #ccc !important;
  }
}
</style>